<template>
  <div class="wrap">
    <div class="container w">
      <el-form
        ref="ruleForm"
        :label-position="labelPosition"
        :model="form"
        label-width="50px"
        size="small"
      >
      <el-form-item label="">
            <el-alert :title="air_tips"  type="success" center show-icon>  </el-alert>
        </el-form-item>

        <el-form-item label="日期:">
          <el-col :span="11">
            <el-date-picker
              type="date"
              placeholder="选择日期"
              v-model="form.date"
               value-format="yyyy-MM-dd"
              style="width: 100%"
            ></el-date-picker>
          </el-col>
          <el-col class="line" :span="2">星期：</el-col>
          <el-col :span="11">
            <el-select v-model="form.week" placeholder="请选择星期">
              <el-option
                v-for="item in form.options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-col>
        </el-form-item>

        <el-form-item label="地址:">
          <el-input v-model="form.address"></el-input>
        </el-form-item>

        <el-form-item label="天气:">
          <el-col :span="11">
            <el-input v-model="form.weather"></el-input>
          </el-col>
          <el-col class="line" :span="2">温度：</el-col>
          <el-col :span="11">
            <el-input v-model="form.temperature"></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="图一:">
          <el-col :span="11">
            <el-time-select
              v-model="form.time1"
              :picker-options="{
                start: '00:00',
                step: '00:1',
                end: '24:00',
              }"
              placeholder="图一时间"
            >
            </el-time-select>
          </el-col>
          <el-col class="line" :span="2">图二：</el-col>
          <el-col :span="11">
            <el-time-select
              v-model="form.time2"
              :picker-options="{
                 start: '00:00',
                step: '00:1',
                end: '24:00',
              }"
              placeholder="图二时间"
            >
            </el-time-select>
          </el-col>
        </el-form-item>

        <el-form-item label="图三:">
          <el-col :span="11">
            <el-time-select
              v-model="form.time3"
              :picker-options="{
                start: '00:00',
                step: '00:1',
                end: '24:00',
              }"
              placeholder="图三时间"
            >
            </el-time-select>
          </el-col>
          <el-col class="line" :span="2">图四：</el-col>
          <el-col :span="11">
            <el-time-select
              v-model="form.time4"
              :picker-options="{
                start: '00:00',
                step: '00:1',
                end: '24:00',
              }"
              placeholder="图四时间"
            >
            </el-time-select>
          </el-col>
        </el-form-item>

        <el-form-item>
          <el-button type="success" icon="el-icon-view" @click="success">生成并预览</el-button>
           <el-button icon="el-icon-help" @click="resetPictureWatermark">清空图片并刷新防伪码</el-button>
        </el-form-item>
        <el-alert :title="update_time" type="warning"> </el-alert>
      </el-form>
    </div>
  </div>
</template>

<script>
import bus from '../bus.js'
export default {
  name: '',
  components: {},
  data () {
    return {
      labelPosition: 'right', // 表单对齐
      air_tips: '今日天气提示刘总：' + JSON.parse(localStorage.getItem('tq')).data.air_tips || '只为刘总摸鱼而开发！', // 今天天气提示
      update_time: '实时天气上次更新时间为：' + JSON.parse(localStorage.getItem('tq')).data.update_time + '   实时天气为三小时更新一次' || '天气自动获取实时天气API调用次数过高， （温度）和（天气）需要手动配置更新', // 天气更新时间
      form: {
        date: JSON.parse(localStorage.getItem('setting')).data.date || '', // 日期
        week: JSON.parse(localStorage.getItem('setting')).data.week || '', // 星期
        address: '广州市 · 华侨城湖岸公馆', // 地址
        weather: JSON.parse(localStorage.getItem('tq')).data.wea || '晴', // 天气
        temperature: JSON.parse(localStorage.getItem('tq')).data.tem || '26', // 温度
        time1: '', // 时间1
        time2: '', // 时间2
        time3: '', // 时间3
        time4: '', // 时间4
        options: [
          {
            value: '一',
            label: '星期一'
          },
          {
            value: '二',
            label: '星期二'
          },
          {
            value: '三',
            label: '星期三'
          },
          {
            value: '四',
            label: '星期四'
          },
          {
            value: '五',
            label: '星期五'
          },
          {
            value: '六',
            label: '星期六'
          },
          {
            value: '日',
            label: '星期日'
          }
        ]
      }
    }
  },
  created () {},
  methods: {
    success () {
      bus.$emit('success', this.form)
    },
    resetPictureWatermark () {
      bus.$emit('ResetPictureWatermark')
    }
  }
}
</script>
<style lang="less" scoped>
.container {
  width: 600px;
}
</style>
